{include file="public/toper"/}
<div class="x-body">
    <form action="" method="post" class="layui-form" id="forms">
        <input type="hidden" value="{$list.navigation_id}" name="navigation_id">
        <div class="layui-form-item">
            <label for="name" class="layui-form-label">
                <span class="x-red">*</span>名称
            </label>
            <div class="layui-input-inline">
                <input type="text" value="{$list.name}" id="name" name="name" required="" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>10个字符以内
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">
                <span class="x-red">*</span>类型
            </label>
            <div class="layui-input-inline">
                <select name="type" lay-filter="type">
                    <option value="1" {if condition = "$list.type eq 1 "}selected="selected"{/if}>跳转</option>
                    <option value="0" {if condition = "$list.type eq 0 "}selected="selected"{/if}>不跳转</option>
                </select>
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>
            </div>
        </div>
        <div class="layui-form-item tz">
            <label for="url" class="layui-form-label">
                <span class="x-red">*</span>URL
            </label>
            <div class="layui-input-inline">
                <input type="text" value="{$list.url}" id="url" name="url" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>20个字符以内
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">
                <span class="x-red">*</span>图片
            </label>
            <div class="layui-input-inline layui-upload" id="upload-thumb">
                <button type="button" class="layui-btn layui-btn-primary" id="image"><i class="layui-icon"></i>上传图片</button>
                <div class="layui-upload-list">
                    {if condition = "$list.img  neq '' "}
                    <img src="{$list.img}" class="layui-upload-list" id="demo" width="100" height="100">
                    {else/}
                    <img class="layui-upload-list imgsc" id="demo">
                    <p id="demoText"></p>
                    {/if}
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"></label>
            <button  class="layui-btn" lay-filter="formSubmit" lay-submit="">提交</button>
        </div>
    </form>
</div>

<script>
    layui.use(['form','layer','upload'], function(){
        $ = layui.jquery;
        var form = layui.form,layer = layui.layer,
            upload = layui.upload;
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#image',
            url: "{:url('Upload/navig')}",
            ext: 'jpg|png|gif',
            drag:false,
            before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#demo').attr('src', result); //图片链接（base64）
                });
            },
            done: function(res){
                //如果上传失败
                if(res.code == 200 ){
                    $('#upload-thumb').append('<input type="hidden" name="img" value="'+ res.data.src+'">');
                }else {
                    layer.msg(res.msg);
                }
                //上传成功
            },
            error: function(){
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                    uploadInst.upload();
                });
            }
        });

        form.on('select(type)', function(data){
            if(data.value==0){
                $(".tz").css("display","none");
            }else {
                $(".tz").css("display","block");
            }
        });

        var type = {$list.type};
        if(type==1){
            $(".tz").css("display","block");
        }else {
            $(".tz").css("display","none");
        }
    });
</script>
{include file="public/footer"/}